<template>
  <div>
    <div class="AllCont mobilTopBox">
      <div class="menuBox marginRight flex flex-direction mobilTop" :style="{ height: screenHeight + 'px' }">
        <div class="posit">
          <div class="return" @click="returnGo">
            <span><i class="iconfont icon-xiangzuo4"></i>标题：{{ returnNav }}</span>
          </div>
        </div>

        <menu-list :returnPath="returnPath" :screenHeightBg="screenHeightBg" @changeCot="changeCot"></menu-list>
      </div>
      <div class="flex flex-direction mainCont" >
        <div class="contAllThree navMarginTop" :style="{ height: screenHeight - 120 + 'px' }">
          <!-- <div class="mobileCont" ref="claims">
            <div class="AllOne" :class="[{ mobileContActive: isMobileCont }]">
              <div class="newChatBtn" @click="openMobileMode">查看历史对话</div>
              <div class="historyTime">当前对话：{{ timeListStr }}</div>
            </div>
          </div> -->
          <!-- 时间 -->
          <div
            :class="[{ mobileMode: isActive }]"
            class="AllOne flexCont flex flex-direction marginRight"
            style="height: 100%;"
            v-if="contentDisplay"
          >
            <div class="posit">
              <div class="return" @click="getGo">
                <span class="span">去填写内容</span>
              </div>
            </div>

            <div class="newChatBtn" @click="addNews">添加新对话</div>
            <div class="timeList flex-1">
              <div
                v-for="(item, index) in timeListLeft"
                :key="index"
                :class="['listOrder', index === timeIndex ? 'active' : '']"
                @click.stop="choseTime(item, index)"
              >
                <img class="session-logo" src="@assets/chat/xinxi.png" alt="" />
                <div class="session-name" v-if="index !== timeIndex || iconShow">{{ item.name }}</div>
                <a-input v-if="index === timeIndex && !iconShow" v-model="editTime" placeholder="请填写备注"></a-input>
                <div class="space" v-if="index === timeIndex && iconShow">
                  <i class="iconfont icon-bianji" @click.stop="editIcon(item)"></i>
                  <a-popconfirm title="确定删除吗?" @confirm="() => deleteTime(item, index)">
                    <i class="iconfont icon-shanchu"></i>
                  </a-popconfirm>
                </div>
                <div class="space" v-if="index === timeIndex && !iconShow">
                  <a-popconfirm title="确定修改吗?" @confirm="() => edit(item, index)">
                    <i class="iconfont icon--zhengque"></i>
                  </a-popconfirm>
                  <i class="iconfont icon--cuowu" @click.stop="closeEdit"></i>
                </div>
                <input class="iconfont" type="radio" v-model="timeIndex" name="sex" :value="index" />
                <!-- <j-date v-model="formData.jDate" :showTime="true" dateFormat="YYYY-MM-DD HH:mm:ss"/> -->
              </div>
            </div>
            <div class="closeMode" @click="isActive = false"><div class="closeBtn">关闭</div></div>
          </div>
          <!-- 内容区 -->
          <div class="AllOne flex flex-direction marginRight" v-if="!contentDisplay"  style="height: 100%;">
            <div class="posit">
              <div class="return" @click="getGo">
                <span class="span">去选择对话时间</span>
              </div>
            </div>
              <div class="timeList flex-1" >
                <work-plan-cent
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '1'"
                ></work-plan-cent>
                <work-plan-ret
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '2'"
                ></work-plan-ret>
                <daily-weekly
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '3'"
                ></daily-weekly>
                <con-tract ref="modalPlanCent" :model="model" @appApiAsk="appApiAsk" v-if="workPlanNum === '4'"></con-tract>
                <email-generator
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '6'"
                ></email-generator>
                <commerce-products
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '11'"
                ></commerce-products>
                <group-buying
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '12'"
                ></group-buying>
                <product-title
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '13'"
                ></product-title>
                <product-positive
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '14'"
                ></product-positive>
                <virtual-purchase
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '15'"
                ></virtual-purchase>
                <negative-review
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '16'"
                ></negative-review>
                <store-reviews
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '17'"
                ></store-reviews>
                <custom-input
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '18'"
                ></custom-input>
                <painting-words
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '19'"
                ></painting-words>
                <new-media
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '20'"
                ></new-media>
                <text-writing
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '210'"
                ></text-writing>
                <video-delivery-copy
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '220'"
                ></video-delivery-copy>
                <student-composition
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '21'"
                ></student-composition>
                <academic-articles
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '22'"
                ></academic-articles>
                <creative-story
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '23'"
                ></creative-story>
                <charac-terization
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '24'"
                ></charac-terization>
                <ghost-story
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '25'"
                ></ghost-story>
                <antithetical-couplet
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '26'"
                ></antithetical-couplet>
                <prose-se ref="modalPlanCent" :model="model" @appApiAsk="appApiAsk" v-if="workPlanNum === '27'"></prose-se>
                <modern-poetry
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '28'"
                ></modern-poetry>
                <seo-optimization
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '31'"
                ></seo-optimization>
                <web-page
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '32'"
                ></web-page>
                 <company-background
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '33'"
                ></company-background>
                <core-values
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '34'"
                ></core-values>
                <core-points
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '35'"
                ></core-points>
                <or-product
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '36'"
                ></or-product>
                <marketing-copy
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '41'"
                ></marketing-copy>
                <advertising-description
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '42'"
                ></advertising-description>
                <advertising-slogan
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '43'"
                ></advertising-slogan>
                <article-outline
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '51'"
                ></article-outline>
                <subject-questions
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '52'"
                ></subject-questions>
                <postgraduate-questions
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '53'"
                ></postgraduate-questions>
                <study-plan
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '54'"
                ></study-plan>
                <paper-outline
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '55'"
                ></paper-outline>
                <paper-abstract
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '56'"
                ></paper-abstract>
                <paper-title
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '57'"
                ></paper-title>
                <ielts-composition
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '58'"
                ></ielts-composition>
                <event-planning
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '59'"
                ></event-planning>
                <new-media
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '71'"
                ></new-media>
                <speech-manuscript
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '72'"
                ></speech-manuscript>
                <article-start
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '73'"
                ></article-start>
                <article-chapter
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '74'"
                ></article-chapter>
                <exploring-stores
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '75'"
                ></exploring-stores>
                <clock-in
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '76'"
                ></clock-in>
                <delivery-copy
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '61'"
                ></delivery-copy>
                <shipping-title
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '62'"
                ></shipping-title>
                <oral-draft
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '63'"
                ></oral-draft>
                <video-inspiration
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '64'"
                ></video-inspiration>
                <video-start
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '65'"
                ></video-start>
                <video-title
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '66'"
                ></video-title>
                <video-outline
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '67'"
                ></video-outline>
                <video-introduce
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '68'"
                ></video-introduce>
                <storyboard-inspiration
                  ref="modalPlanCent"
                  :model="model"
                  @appApiAsk="appApiAsk"
                  v-if="workPlanNum === '69'"
                ></storyboard-inspiration>
              </div>
              <div class="btnBoTm justify-between">
                  <div class="sheCot" @click="generatedBtn" v-if="loadingShow">生成内容</div>
                  <div class="sheCot copy" v-else>
                    正在加载中
                    <div class="loading"></div>
                  </div>
                  <!-- <div class="sheCot copy">生成内容</div> -->
                </div>
          </div>
          <!-- 生成区 -->
          <div class="AllOne flexReturn marginRight">
            <div class="timeList">
              <h6>生成结果</h6>
              <div class="empty" v-if="ifEmpty">
                <img class="session-logo" src="@assets/chat/empty.png" alt="" />
                <div class="btnBoTm justify-between" v-if="machinery">
                  <div class="copy" style="font-weight: bold">
                    正在生成中...
                    <div class="loading"></div>
                  </div>
                </div>
                <div v-else>
                  <div class="empty-title">暂无内容</div>
                  <div class="empty-content">暂无生成结果，快去创建吧！！</div>
                </div>
              </div>
              <div class="contentBox" v-else>
                <a-tabs @change="callback">
                  <a-tab-pane v-for="(item, index) in evenListData" :tab="'结果' + (index + 1)" :key="index">
                    <div class="result-module">
                      <div class="module-title">
                        <img class="session-logo" src="~@/assets/logo.png" alt="" />宇时企业智能助手
                      </div>
                      <div class="result-content">
                        <div class="result-text"><div v-html="textareaTo(item.answer)"></div><div class="execute" v-if="machinery">...<div class="loading"></div></div></div>
                        <!-- <div class="result-time">{{ item.updateTime }}</div> -->
                      </div>
                    </div>
                  </a-tab-pane>
                </a-tabs>
              </div>
            </div>
          </div>
        </div>
        <global-footer />
      </div>
   
    </div>

    <member-model ref="modalMember" v-if="memberShow"></member-model>
    <div class="moveUpDown" @click.stop="scrollUp"><img src="@assets/down.png" alt="" /></div>
  </div>
</template>

<script>
// import IndexChart from './IndexChart'
// import IndexTask from "./IndexTask"
// import IndexBdc from './IndexBdc'
import { mapGetters } from 'vuex'
import { sessionNoteList } from '@/api/api'
import { deleteAction } from '@/api/manage'
import { DialogueWebsocketMixin } from '@/mixins/DialogueWebsocketMixin'
import GlobalFooter from '@/components/page/GlobalFooter'
import MenuList from '../component/MenuList.vue'
import WorkPlanCent from './modules/WorkPlanCent' //工作计划
import WorkPlanRet from './modules/WorkPlanReprt' //总结报告
import DailyWeekly from './modules/DailyWeekly' //日报周报
import ConTract from './modules/ConTract' //生成合同
import EmailGenerator from './modules/EmailGenerator' //电子邮件生成器
import CommerceProducts from './modules/CommerceProducts' //电商商品详情文案
import GroupBuying from './modules/GroupBuying' //团购套餐介绍
import ProductTitle from './modules/ProductTitle' //商品标题生成
import ProductPositive from './modules/ProductPositive' //商品好评
import VirtualPurchase from './modules/VirtualPurchase' //虚拟购买评论
import NegativeReview from './modules/NegativeReview' //差评转化
import StoreReviews from './modules/StoreReviews' //大众点评/美团探店点评
import MemberModel from '../component/MemberModel' //付费跳转弹框

import CustomInput from './modules/CustomInput' //自定义输入
import PaintingWords from './modules/PaintingWords.vue' //Ai绘画描述词
import TextWriting from './modules/TextWriting.vue' //全文写作(步骤式)
import VideoDeliveryCopy from './modules/VideoDeliveryCopy.vue' //短视频带货文案
import StudentComposition from './modules/StudentComposition.vue' //学生作文
import AcademicArticles from './modules/AcademicArticles.vue' //学术文章
import CreativeStory from './modules/CreativeStory.vue' //创意故事
import CharacTerization from './modules/CharacTerization.vue' //创意故事
import GhostStory from './modules/GhostStory.vue' //赛博朋克鬼故事
import AntitheticalCouplet from './modules/AntitheticalCouplet.vue' //对联
import ProseSe from './modules/ProseSe.vue' //散文
import ModernPoetry from './modules/ModernPoetry.vue' //现代诗
import SeoOptimization from './modules/SeoOptimization.vue' //网站首页SEO优化
import WebPage from './modules/WebPage.vue' //网页大标题
import CompanyBackground from './modules/CompanyBackground.vue' //公司背景
import CoreValues from './modules/CoreValues.vue' //产品核心价值
import CorePoints from './modules/CorePoints.vue' //产品核心要点
import OrProduct from './modules/OrProduct.vue' //公司或产品起名
import MarketingCopy from './modules/MarketingCopy.vue' //营销文案-引导下单
import AdvertisingDescription from './modules/AdvertisingDescription.vue' //广告描述
import AdvertisingSlogan from './modules/AdvertisingSlogan.vue' //广告标语
import ArticleOutline from './modules/ArticleOutline.vue' //文章主题及大纲
import SubjectQuestions from './modules/SubjectQuestions.vue' //文章主题及大纲
import PostgraduateQuestions from './modules/PostgraduateQuestions.vue' //考研题目
import StudyPlan from './modules/StudyPlan.vue' //学习计划
import PaperOutline from './modules/PaperOutline.vue' //论文大纲
import PaperAbstract from './modules/PaperAbstract.vue' //论文摘要
import PaperTitle from './modules/PaperTitle.vue' //论文标题
import IeltsComposition from './modules/IeltsComposition.vue' //雅思大作文
import EventPlanning from './modules/EventPlanning.vue' //学生会活动策划
import NewMedia from './modules/NewMedia.vue' //新媒体全文写作
import SpeechManuscript from './modules/SpeechManuscript.vue' //发言稿
import ArticleStart from './modules/ArticleStart.vue' //发言稿
import ArticleChapter from './modules/ArticleChapter.vue' //文章章节内容
import ExploringStores from './modules/ExploringStores.vue' //餐馆探店文案
import ClockIn from './modules/ClockIn.vue' //景点打卡文案
import DeliveryCopy from './modules/DeliveryCopy.vue' //短视频带货文案
import ShippingTitle from './modules/ShippingTitle.vue' //抖音带货标题
import OralDraft from './modules/OralDraft.vue' //带货视频口播稿
import VideoInspiration from './modules/VideoInspiration.vue' //视频灵感
import VideoStart from './modules/VideoStart.vue' //视频吸睛开头
import VideoTitle from './modules/VideoTitle.vue' //视频标题
import VideoOutline from './modules/VideoOutline.vue' //短视频脚本大纲
import VideoIntroduce from './modules/VideoIntroduce.vue' //视频介绍
import StoryboardInspiration from './modules/StoryboardInspiration.vue' //短视频分镜灵感

export default {
  mixins: [DialogueWebsocketMixin],
  name: 'WorkPlan',
  components: {
    GlobalFooter,
    MenuList,
    WorkPlanCent,
    WorkPlanRet,
    DailyWeekly,
    ConTract,
    EmailGenerator,
    CommerceProducts,
    GroupBuying,
    ProductTitle,
    ProductPositive,
    VirtualPurchase,
    NegativeReview,
    StoreReviews,
    MemberModel,
    CustomInput,
    PaintingWords,
    TextWriting,
    VideoDeliveryCopy,
    StudentComposition,
    AcademicArticles,
    CreativeStory,
    CharacTerization,
    GhostStory,
    AntitheticalCouplet,
    ProseSe,
    ModernPoetry,
    SeoOptimization,
    WebPage,
    CompanyBackground,
    CoreValues,
    CorePoints,
    OrProduct,
    MarketingCopy,
    AdvertisingDescription,
    AdvertisingSlogan,
    ArticleOutline,
    SubjectQuestions,
    PostgraduateQuestions,
    StudyPlan,
    PaperOutline,
    PaperAbstract,
    PaperTitle,
    IeltsComposition,
    EventPlanning,
    NewMedia,
    SpeechManuscript,
    ArticleStart,
    ArticleChapter,
    ExploringStores,
    ClockIn,
    DeliveryCopy,
    ShippingTitle,
    OralDraft,
    VideoInspiration,
    VideoStart,
    VideoTitle,
    VideoOutline,
    VideoIntroduce,
    StoryboardInspiration,
  },
  props: {
    returnNav: {
      type: String,
      default: '全部',
    },
    returnPath: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      contentDisplay: false,
      model: {},
      isActive: false,
      returnTitle: '工作计划',
      isMobileCont: false,
      memberShow: false,
      iconShow: true,
      loadingShow: true,
      confirmLoading: false,
      acquisitionTime: '',
      workPlanNum: '1',
      editTime: '',
      tabs: [{ title: '1' }, { title: '2' }, { title: '3' }, { title: '4' }],
      screenWidth: '',
      screenHeight: '',
      screenHeightBg: '',
      timeIndex: 0,
      sessionTypeId: '',
      formData: {
        jDate: '2019-5-10 15:33:06',
      },
      listData: [
        {
          time: '2023-08-31 16:16',
          type: '1',
        },
        {
          time: '2023-08-29 16:16',
          type: '2',
        },
        {
          time: '2023-08-30 16:16',
          type: '3',
        },
      ],
      sessionNoteData: [],
      generatedContentList: [],
      timeListLeft: [],
      ifEmpty: true,
      machinery: false,
      evenListData: [],
      listData2: {},
      timeListStr: '',
    }
  },
  created() {},
  computed: {},
  watch: {
    //监听路由地址的改变 $route
    returnPath: {
      immediate: true,
      handler() {
        // let path = this.$route.fullPath
        // console.log('path', path)
        // let paths = path.split('/')
        // let routePath = paths[paths.length - 1]
        let routePath = this.returnPath
        console.log('routePath', routePath)
        if (routePath === 'WorkPlan') {
          this.workPlanNum = '1'
          this.returnTitle = '工作计划'
        } else if (routePath === 'WorkPlanReprt') {
          this.workPlanNum = '2'
          this.returnTitle = '总结报告'
        } else if (routePath === 'DailyWeekly') {
          this.workPlanNum = '3'
          this.returnTitle = '日报周报'
        } else if (routePath === 'ConTract') {
          this.workPlanNum = '4'
          this.returnTitle = '生成合同'
        } else if (routePath === 'EmailGenerator') {
          this.workPlanNum = '6'
          this.returnTitle = '电子邮件生成器'
        } else if (routePath === 'CommerceProducts') {
          this.workPlanNum = '11'
          this.returnTitle = '电商商品详情文案'
        } else if (routePath === 'GroupBuying') {
          this.workPlanNum = '12'
          this.returnTitle = '团购套餐介绍'
        } else if (routePath === 'ProductTitle') {
          this.workPlanNum = '13'
          this.returnTitle = '商品标题生成'
        } else if (routePath === 'ProductPositive') {
          this.workPlanNum = '14'
          this.returnTitle = '商品好评'
        } else if (routePath === 'VirtualPurchase') {
          this.workPlanNum = '15'
          this.returnTitle = '虚拟购买评论'
        } else if (routePath === 'NegativeReview') {
          this.workPlanNum = '16'
          this.returnTitle = '差评转化'
        } else if (routePath === 'StoreReviews') {
          this.workPlanNum = '17'
          this.returnTitle = '大众点评/美团探店点评'
        } else if (routePath === 'CustomInput') {
          // AI写作猿
          this.workPlanNum = '18'
          this.returnTitle = '自定义输入'
        } else if (routePath === 'PaintingWords') {
          // AI写作猿
          this.workPlanNum = '19'
          this.returnTitle = 'Ai绘画描述词'
        } else if (routePath === 'StudentComposition') {
          // AI写作猿
          this.workPlanNum = '21'
        } else if (routePath === 'AcademicArticles') {
          // AI写作猿
          this.workPlanNum = '22'
        } else if (routePath === 'CreativeStory') {
          // AI写作猿
          this.workPlanNum = '23'
        } else if (routePath === 'CharacTerization') {
          // AI写作猿
          this.workPlanNum = '24'
        } else if (routePath === 'GhostStory') {
          // AI写作猿
          this.workPlanNum = '25'
        } else if (routePath === 'AntitheticalCouplet') {
          // AI写作猿
          this.workPlanNum = '26'
        } else if (routePath === 'ProseSe') {
          // AI写作猿
          this.workPlanNum = '27'
        } else if (routePath === 'ModernPoetry') {
          // AI写作猿
          this.workPlanNum = '28'
        }else if (routePath === 'SeoOptimization') {
          // AI写作猿
          this.workPlanNum = '31'
        }else if (routePath === 'WebPage') {
          // AI写作猿
          this.workPlanNum = '32'
        }else if (routePath === 'CompanyBackground') {
          // AI写作猿
          this.workPlanNum = '33'
        }else if (routePath === 'CoreValues') {
          // AI写作猿
          this.workPlanNum = '34'
        }else if (routePath === 'CorePoints') {
          // AI写作猿
          this.workPlanNum = '35'
        }else if (routePath === 'OrProduct') {
          // AI写作猿
          this.workPlanNum = '36'
        }else if (routePath === 'MarketingCopy') {
          // AI写作猿
          this.workPlanNum = '41'
        }else if (routePath === 'AdvertisingDescription') {
          // AI写作猿
          this.workPlanNum = '42'
        }else if (routePath === 'AdvertisingSlogan') {
          // AI写作猿
          this.workPlanNum = '43'
        }else if (routePath === 'ArticleOutline') {
          // AI写作猿
          this.workPlanNum = '51'
        }else if (routePath === 'SubjectQuestions') {
          // AI写作猿
          this.workPlanNum = '52'
        }else if (routePath === 'PostgraduateQuestions') {
          // AI写作猿
          this.workPlanNum = '53'
        }else if (routePath === 'StudyPlan') {
          // AI写作猿
          this.workPlanNum = '54'
        }else if (routePath === 'PaperOutline') {
          // AI写作猿
          this.workPlanNum = '55'
        }else if (routePath === 'PaperAbstract') {
          // AI写作猿
          this.workPlanNum = '56'
        }else if (routePath === 'PaperTitle') {
          // AI写作猿
          this.workPlanNum = '57'
        }else if (routePath === 'IeltsComposition') {
          // AI写作猿
          this.workPlanNum = '58'
        }else if (routePath === 'EventPlanning') {
          // AI写作猿
          this.workPlanNum = '59'
        }else if (routePath === 'NewMedia') {
          // AI写作猿
          this.workPlanNum = '71'
        }else if (routePath === 'SpeechManuscript') {
          // AI写作猿
          this.workPlanNum = '72'
        }else if (routePath === 'ArticleStart') {
          // AI写作猿
          this.workPlanNum = '73'
        }else if (routePath === 'ArticleChapter') {
          // AI写作猿
          this.workPlanNum = '74'
        }else if (routePath === 'ExploringStores') {
          // AI写作猿
          this.workPlanNum = '75'
        }else if (routePath === 'ClockIn') {
          // AI写作猿
          this.workPlanNum = '76'
        }else if (routePath === 'DeliveryCopy') {
          // AI写作猿
          this.workPlanNum = '61'
        }else if (routePath === 'ShippingTitle') {
          // AI写作猿
          this.workPlanNum = '62'
        }else if (routePath === 'OralDraft') {
          // AI写作猿
          this.workPlanNum = '63'
        }else if (routePath === 'VideoInspiration') {
          // AI写作猿
          this.workPlanNum = '64'
        }else if (routePath === 'VideoStart') {
          // AI写作猿
          this.workPlanNum = '65'
        }else if (routePath === 'VideoTitle') {
          // AI写作猿
          this.workPlanNum = '66'
        }else if (routePath === 'VideoOutline') {
          // AI写作猿
          this.workPlanNum = '67'
        }else if (routePath === 'VideoIntroduce') {
          // AI写作猿
          this.workPlanNum = '68'
        }else if (routePath === 'StoryboardInspiration') {
          // AI写作猿
          this.workPlanNum = '69'
        }
        
        this.timeIndex = 0
        this.workPlanList()
      },
    },
  },

  mounted() {
    this.$nextTick(function () {
      this.screenWidth = window.innerWidth
      this.screenHeight = window.innerHeight
      this.screenHeightBg = this.screenHeight - 52 + 'px'
      // this.workPlanList()
      document.addEventListener('scroll', this.handleScroll, true)
    })
  },
  beforeDestroy() {
    document.removeEventListener('scroll', this.handleScroll, true)
  },
  methods: {
    ...mapGetters(['userInfo']),
    changeCot(item){
      console.log('item',item)
      this.$emit('changeCot',item)
    },
    returnGo() {
      this.$emit('returnChan')
    },
    handleScroll(e) {
      var that = this
      const winHeight = e.target.scrollTop || document.documentElement.scrollTop
      // const divSetTop = that.$refs.claims.offsetTop
      // console.log(winHeight)
      if (winHeight >= 71) {
        that.isMobileCont = true
      } else {
        that.isMobileCont = false
      }
    },
    scrollUp() {
      document.body.scrollTop = document.documentElement.scrollTop = 0
    },
    openMobileMode() {
      this.isActive = true
    },
    modalFormOk() {},
    // 修改时间
    editIcon(data) {
      console.log('data', data)
      this.editTime = data.name
      this.iconShow = false
    },
    edit(data, index) {
      let obj = {
        name: this.editTime,
        id: data.id,
      }
      this.$http
        .post('/aiapp/sessionNote/edit', obj)
        .then((res) => {
          console.log('res', res)
          // this.workPlanList()
          if (res.success) {
            this.timeListLeft[index].name = this.editTime
            this.iconShow = true
          }
        })
        .catch((error) => {
          console.log('error', error)
        })
    },
    deleteTime(data, index) {
      let obj = {
        templateCode: this.workPlanNum,
        id: data.id,
      }

      deleteAction('/aiapp/sessionNote/delete', obj).then((res) => {
        if (res.success) {
          this.timeListLeft.splice(index, 1)
          if (this.timeListLeft.length === 0) {
            this.workPlanList()
          } else {
            this.timeIndex = 0
            this.choseTime(this.timeListLeft[0], 0,'delete')
            this.$message.success('删除成功')
          }
        }
      })
    },
    closeEdit() {
      this.iconShow = true
    },
    // 选择统计图类别
    callback(key) {
      console.log('key', key)
      this.model = this.evenListData[key]
      if(!this.contentDisplay){
        this.$refs.modalPlanCent.models = this.model
      }
      
    },
    //处理数据
    evenList(meg) {
      let list = meg
      let key = 'sessionType'
      let key1 = 'createTime'
      var keysArr = list.map((item) => item[key])
      var keys = [...new Set(keysArr)]
      var newList = keys.map((item) => {
        return {
          [key]: item,
          [key1]: list.filter((i) => i[key] == item)[0].createTime,
          list: list.filter((i) => i[key] == item),
        }
      })
      // var array = newList.length === 0 ? this.newList : newList
      var array = newList
      console.log('array', array)
      this.model = array[0].list[0] //中间数据
      if(!this.contentDisplay){
        this.$refs.modalPlanCent.models = this.model
      }
      this.evenListData = array[0].list //右边数据
    },
    workPlanList() {
      let obj = {
        type: this.workPlanNum,
        userId: this.userInfo().id,
      }

      sessionNoteList(obj).then((res) => {
        console.log('res', res)
        let data = res.result
        this.sessionNoteData = data
        this.timeListLeft = data.reverse()
        if (res.result.length === 0) {
          this.sessionNoteAdd()
        } else {
          this.appApiList()
        }
      })
    },
    sessionNoteAdd() {
      let obj = {
        type: this.workPlanNum,
        userId: this.userInfo().id,
      }
      this.$http
        .post('/aiapp/sessionNote/add', obj)
        .then((res) => {
          console.log('res', res)
          this.workPlanList()
        })
        .catch((error) => {
          console.log('error', error)
        })
    },
    appApiList() {
      let obj = {
        templateCode: this.workPlanNum,
        sessionType: this.sessionNoteData[this.timeIndex].id,
      }
      this.$http
        .post('/app/api/list', obj)
        .then((res) => {
          console.log('/app/api/list', res)
          let data = res.result
          this.timeListStr = this.timeListLeft[this.timeIndex].name
          if (data.length === 0) {
            this.model = {}
            if(!this.contentDisplay){
              this.$refs.modalPlanCent.models = this.model
            }
            this.evenListData = []
            this.ifEmpty = true
            console.log('timeListLeft', this.timeListLeft[this.timeIndex].createTime)
          } else {
            this.generatedContentList = data.reverse()
            if (this.generatedContentList.length >= 1) {
              this.ifEmpty = false
              this.evenList(this.generatedContentList)
              this.$store.dispatch('userLimitList', { userId: this.userInfo().id })
            }
          }
        })
        .catch((error) => {
          console.log('error', error)
        })
    },
    textareaTo(str) {
      if (str !== undefined) {
        let regs = new RegExp('\r', 'g')
        let reg = new RegExp('\n', 'g')
        let regSpace = new RegExp(' ', 'g')
        str = str.replace(reg, '<br/>')
        str = str.replace(regs, '<br/>')
        str = str.replace(regSpace, '&nbsp;')
        // console.log('str',str)
        return str
      }
    },
    choseTime(item, index,type) {
      console.log('index', item, index)
      this.close()
      if(type === 'delete'){
        this.timeIndex = index
        this.appApiList()
      }else{
        if(this.timeIndex === index){
          return
        }
        this.timeIndex = index
        this.appApiList()
      }
      if (!this.iconShow) {
        this.iconShow = true
      }
    
    },
    addNews() {
      this.sessionNoteAdd()
      // let obj = {
      //   createTime: this.currentTime(),
      //   answer:'',
      // }
      // this.generatedContentList.unshift(obj)
      this.timeIndex = 0
      this.model = {}
      this.evenListData = []

      this.timeIndex = 0
    },
    generatedBtn() {
      this.initWebSocket()
      this.model = this.$refs.modalPlanCent.models
      this.loadingShow = false
      this.machinery = true
      this.model.id = ''
      console.log('obj', this.model)
      this.$refs.modalPlanCent.generatedBtnProp()

      // this.$refs.form.validate(valid => {
      //     if (valid) {
      //       this.$http
      //         .post('/app/api/ask', obj)
      //         .then((res) => {
      //           console.log('res', res)
      //           this.loadingShow = true
      //           this.appApiList()

      //         })
      //         .catch((error) => {
      //           console.log('error', error)
      //         })
      //     }else{
      //         this.loadingShow = true
      //         this.$message.warning('请填写必填项!')

      //     }
      //   })
    },
    appApiAsk(index, models) {
      console.log('index', index)
      if (index === 2) {
        this.loadingShow = true
        this.machinery = false
        this.$message.warning('请填写必填项!')
      } else {
        this.ifEmpty = true
        models.sessionType = this.timeListLeft[this.timeIndex].id
        models.templateCode = this.workPlanNum
        this.evenListData.unshift({
          answer: '',
        })

        this.$http
          .post('/app/api/ask', models)
          .then((res) => {
            console.log('res', res)
            if(res.success){
              if (res.code === 500) {
              this.$notification.warn({
                message: '提示',
                description: res.message,
                duration: 5,
              })
              this.memberShow = true
              this.loadingShow = true
              this.machinery = false
            } else if (res.code === 501) {
              this.$notification.warn({
                message: '提示',
                description: res.message,
                duration: 5,
              })
              this.imgShowBool = true
              this.imgLoading = false
            } else {
              if (res.success) {
                this.loadingShow = true
                this.machinery = false
                this.appApiList()
              } else {
                this.$message.error('操作失败，请联系管理员！')
              }
            }
            }else{
              this.$notification.warn({
                message: '提示',
                description: res.message,
                duration: 5,
              })
              this.loadingShow = true
                this.machinery = false
            }
           
          })
          .catch((error) => {
            console.log('error', error)
          })
      }
    },
    websocketOnmessage: function (e) {
      console.log('-----接收消息-------', e.data)
     
      if(this.ifEmpty){
        this.ifEmpty = false
      }
      console.log('evenListData',this.evenListData)
      this.evenListData[0].answer  += e.data
      // var cont;
      // let obj = {
      //   answer : cont += e.data
      // }
      // console.log("obj",obj)
      // this.evenListData.push(obj)
    },
    /**
     * 获取当前时间
     */
    currentTime() {
      var date = new Date()
      var year = date.getFullYear() //月份从0~11，所以加一
      let month = date.getMonth()
      console.log('month', month)
      var dateArr = [date.getMonth() + 1, date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds()]
      //如果格式是MM则需要此步骤，如果是M格式则此循环注释掉
      for (var i = 0; i < dateArr.length; i++) {
        if (dateArr[i] >= 1 && dateArr[i] <= 9) {
          dateArr[i] = '0' + dateArr[i]
        }
      }
      var strDate = year + '-' + dateArr[0] + '-' + dateArr[1] + ' ' + dateArr[2] + ':' + dateArr[3] + ':' + dateArr[4]
      //此处可以拿外部的变量接收，也可直接返回  strDate:2022-05-01 13:25:30
      //this.date = strDate;
      return strDate
    },
    getGo() {
      this.contentDisplay = !this.contentDisplay
    },
  },
}
</script>

<style lang="less">
.justify-between {
  .sheCot {
    width: 100%;
    line-height: 27px;
    color: #fff;
    background: linear-gradient(90deg, #938bff, #ff97f2);
    border-color: #938bff;
    display: inline-block;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    text-align: center;
    box-sizing: border-box;
    outline: 0;
    margin: 0;
    transition: 0.1s;
    font-weight: 500;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    &.copy {
      background: white;
      color: black;
      border: 1px solid #dcdfe6;
    }
  }
  .sheCot:hover {
    opacity: 0.7;
  }
}

.AllOne {
  .ant-form-item {
    float: left;
    width: 100%;
  }
  .ant-form-item-label {
    float: left;
    width: 100%;
    text-align: left;
    font-size: 14px;
    font-weight: 600;
    color: #414141;
  }
  .ant-form-item-control-wrapper {
    .ant-form-item-control {
      height: 40px;
      line-height: 40px;
    }
  }
  textarea {
    width: 100%;
    float: left;
  }
  .ant-col-sm-12 {
    width: 100%;
  }
  input {
    height: 40px;
    line-height: 40px;
    outline: 0;
    padding: 0 15px;
  }
  .ant-input-number {
    height: 40px;
    line-height: 40px;
    width: 100%;
  }
  .ant-select-selection--single {
    height: 40px;
    line-height: 40px;
  }
  .ant-select-selection__rendered {
    line-height: 39px;
  }
  .btnBoTm {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 10px;
  }
  .ant-form-item-with-help {
    margin-bottom: 24px;
  }
}

.timeList {
  display: flex;
    flex-direction: column;
    height: 100%;
  h6 {
    font-size: 14px;
    font-weight: bold;
    margin-top: 9px;
  }
  .empty {
    text-align: center;
    padding-bottom: 50px;
  background: #f7f7f7;
    img {
      width: 38%;
    }
    .empty-title {
      font-size: 20px;
      font-weight: 500;
      color: #8cbbff;
    }
    .empty-content {
      font-size: 16px;
      font-weight: 500;
      color: #8cbbff;
      margin-top: 5px;
    }
  }
  .contentBox{
    flex: 1;
    overflow: hidden auto;
    .ant-tabs{
      display: flex;
      flex-direction: column;
    }
  }
}
.result-module {
  padding: 16px 20px 16px;
  border-radius: 8px;
  background: #f7f7f7;
  cursor: pointer;
  .module-title {
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: bold;
    img {
      width: 60px;
      margin-right: 10px;
    }
  }
  .result-content {
    .result-text {
      margin-top: 20px;
      font-size: 16px;
      color: black;
    }
    .result-time {
      font-size: 14px;
      margin-top: 20px;
    }
  }
}

.loading {
  width: 22px;
  height: 22px;
  border: 2px solid #1890ff;
  border-top-color: transparent;
  border-radius: 50%;
  animation: rotate 0.75s linear infinite;
  float: right;
  margin-left: 4px;
}

@keyframes rotate {
  to {
    transform: rotate(360deg);
  }
}

.ant-spin-container {
  .editIconMore {
    display: flex;
    align-items: center;
    float: left;
  }
  .addIcon,
  .shuInput {
    width: 100px;
    text-align: center;
    margin-left: 5px;
    height: 40px;
    line-height: 40px;
    background-color: #938bff;
    border-color: #938bff;
    border-radius: 4px;
    cursor: pointer;
    color: white;
  }
  .shuInput {
    background-color: white;
    border: 1px solid #d9d9d9;
    color: black;
  }
}

.editIconMore {
  .ant-select-selection--multiple {
    .ant-select-selection__choice {
      background-color: #ff97f2;
      color: white;
      .ant-select-remove-icon {
        color: white;
      }
    }
  }
  &.clearInput {
    .ant-select {
      width: unset !important;
    }
    .ant-select:hover {
      border: unset !important;
    }
    // .ant-select-selection__rendered {
    //   margin-right: 0 !important;
    // }
    .ant-select-selection {
      background: unset !important;
      border: unset !important;
    }
  }
}

.posit {
  height: 60px;
  .return {
    // position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    padding: 10px;
    i {
      font-size: 19px;
      margin-right: 5px;
      color: #938bff;
    }
    span {
      font-size: 14px;
      color: black;
    }
    .span {
      color: #938bff;
    }
  }
}

.ant-layout-content {
  width: 100%;
}
.menuBox {
  width: 200px;
  background: white;
  float: left;
  position: relative;
}
.projectBox {
  margin: 0;
}
.leSto {
}

</style>

<style lang="less" scoped>
@media screen and (max-width: 767px) {
  .mobilTopBox{
    margin-top: 68px!important;
  }
  .menuBox{
    height: auto!important;
    float: left;
    width: 100%;
    .asideBox{
      display: none;
    }
  }
  .mainCont{
      float: left;
      .contAllThree {
        height: auto!important;
        margin-top: 10px!important;
      }

    }
}


</style>